<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head lang="en">
		<meta charset="utf-8" />
		<title>二手交易商城商品</title>
		<link rel="stylesheet" type="text/css" href="../../css/public.css"/>
		<link rel="stylesheet" type="text/css" href="../../css/proList.css"/>
	</head>
	<body>
		<!------------------------------head------------------------------>
		<div class="head">
			<div class="wrapper clearfix">
				<div class="clearfix" id="top">
					<h1 class="fl"><a href="index"><img src="../../img/temp/logo2.png"/></a></h1>
					<div class="fr clearfix" id="top1">
						<p class="fl"  th:if="${session.username==null}">
							<a href="login" id="login">登录</a>
							<a href="reg" id="reg">注册</a>
						</p>
						<p class="fl" th:unless="${session.username==null}">
							<a ><span type="text" id="username"></span></a>
						</p>
						<form th:action="@{/front/search}" th:method="post" enctype="multipart/form-data" class="fl">
							<input type="text" th:id="search" th:name="search" placeholder="搜索" />
							<input type="submit" value=""/>
						</form>
						<div class="btn fl clearfix">
							<a th:href="@{/front/mygxin}"><img src="../../img/grzx.png"/></a>
							<a href="#" class="er1"><img src="../../img/ewm.png"/></a>
							<a th:href="@{/front/cart}"><img src="../../img/gwc.png"/></a>
							<p><a href="#"><img src="../../img/smewm.png"/></a></p>
						</div>
					</div>
				</div>
				<ul class="clearfix" id="bott">
					<li><a th:href="@{/front/index}">首页</a></li>
					<li>
						<a href="#">所有商品</a>
						<div class="sList">
							<div class="wrapper  clearfix">
								<a th:each="category,categoryStat:${category}" th:href="@{/front/getcategory(categoryId=${category.categoryId},sort=99)}">
									<dl>
										<dt><img th:src="@{'/files/test/pic/'+${category.photo}}"/></dt>
										<dd th:text="${category.name}"></dd>
									</dl>
								</a>
							</div>
						</div>
					</li>
					<li th:each="category,categoryStat:${category}">
						<a th:href="@{/front/getcategory(categoryId=${category.categoryId},sort=99)}">
							<span th:text="${category.name}"></span>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<!------------------------------banner------------------------------>
		<div class="banner">
			<a href="#"><img src="../../img/temp/banner1.jpg"/></a>
		</div>
		<!-----------------address------------------------------->
		<div class="address" >
			<div class="wrapper clearfix" th:each="categories,categoriesStat:${categories}">
				<a href="index">首页</a>
				<span>/</span>
				<a href="flowerDer" class="on" th:text="${categories.name}"></a>
			</div>
		</div>
		<!-------------------current---------------------->
		<div class="current">
			<div class="wrapper clearfix" th:each="categories,categoriesStat:${categories}">
				<!--/*@thymesVar id="name" type=""*/-->
				<h3 class="fl" th:text="${categories.name}"></h3>
				<div class="fr choice">
					<p class="default">排序方式</p>
					<ul class="select">
						<li><a th:href="@{/front/getcategory(categoryId=${param.categoryId},sort='新品上市')}">新品上市</a></li>
						<li><a th:href="@{/front/getcategory(categoryId=${param.categoryId},sort='销量从高到低')}">销量从高到低</a></li>
						<li><a th:href="@{/front/getcategory(categoryId=${param.categoryId},sort='销量从低到高')}">销量从低到高</a></li>
						<li><a th:href="@{/front/getcategory(categoryId=${param.categoryId},sort='价格从高到低')}">价格从高到低</a></li>
						<li><a th:href="@{/front/getcategory(categoryId=${param.categoryId},sort='价格从低到高')}">价格从低到高</a></li>
					</ul>
				</div>
			</div>
		</div>
		<!----------------proList------------------------->
		<ul class="proList wrapper clearfix" >
			<li th:each="product,productStat:${products}">
				<a th:href="@{/front/getproduct(productId=${product.productId})}">
					<dl>
						<dt ><img th:src="@{'/files/test/pic/'+${product.photo}}"/></dt>
						<dd th:text="${product.name}"></dd>
						<dd>￥<span th:text="${product.price}"></span></dd>
					</dl>
				</a>
			</li>
		</ul>
		<!----------------mask------------------->
		<div class="mask"></div>
		<!-------------------mask内容------------------->
		<div class="proDets">
			<img class="off" src="../../img/temp/off.jpg" />
			<div class="tit clearfix">
				<h4 class="fl">【最家】非洲菊仿真花干花</h4>
				<span class="fr">￥17.90</span>
			</div>
			<div class="proCon clearfix">
				<div class="proImg fl">
					<img class="list" src="../../img/temp/proDet.jpg"  />
					<div class="smallImg clearfix">
						<img src="../../img/temp/proDet01.jpg" data-src="../../img/temp/proDet01_big.jpg">
						<img src="../../img/temp/proDet02.jpg" data-src="../../img/temp/proDet02_big.jpg">
						<img src="../../img/temp/proDet03.jpg" data-src="../../img/temp/proDet03_big.jpg">
						<img src="../../img/temp/proDet04.jpg" data-src="../../img/temp/proDet04_big.jpg">
					</div>
				</div>
				<div class="fr">
					<div class="proIntro">
						<p>颜色分类</p>
						<div class="smallImg clearfix categ">
							<p class="fl"><img src="../../img/temp/prosmall01.jpg" alt="白瓷花瓶+20支快乐花" data-src="../../img/temp/proBig01.jpg"></p>
							<p class="fl"><img src="../../img/temp/prosmall02.jpg" alt="白瓷花瓶+20支兔尾巴草" data-src="../../img/temp/proBig02.jpg"></p>
							<p class="fl"><img src="../../img/temp/prosmall03.jpg" alt="20支快乐花" data-src="../../img/temp/proBig03.jpg"></p>
							<p class="fl"><img src="../../img/temp/prosmall04.jpg" alt="20支兔尾巴草" data-src="../../img/temp/proBig04.jpg"></p>
						</div>
						<p>数量</p>
						<div class="num clearfix">
							<img class="fl sub" src="../../img/temp/sub.jpg">
							<span class="fl" contentEditable="true">1</span>
							<img class="fl add" src="../../img/temp/add.jpg">
							<p class="please fl">请选择商品属性!</p>
						</div>
					</div>
					<div class="btns clearfix">
						<a href="#2"><p class="buy fl">立即购买</p></a>
						<a href="#2"><p class="cart fr">加入购物车</p></a>
					</div>
				</div>
			</div>
			<a class="more" href="proDetail">查看更多细节</a>
		</div>
		<!--返回顶部-->
		<div th:replace="~{front/public/gotop::endbar}"></div>


		<div class="msk"></div>
		<!--footer-->
		<div class="footer">
			<div class="top">
				<div class="wrapper">
					<div class="clearfix">
						<a href="#2" class="fl"><img src="../../img/foot1.png"/></a>
						<span class="fl">7天无理由退货</span>
					</div>
					<div class="clearfix">
						<a href="#2" class="fl"><img src="../../img/foot2.png"/></a>
						<span class="fl">15天免费换货</span>
					</div>
					<div class="clearfix">
						<a href="#2" class="fl"><img src="../../img/foot3.png"/></a>
						<span class="fl">满599包邮</span>
					</div>
					<div class="clearfix">
						<a href="#2" class="fl"><img src="../../img/foot4.png"/></a>
						<span class="fl">手机特色服务</span>
					</div>
				</div>
			</div>
			<p class="dibu">最家家居&copy;2013-2017公司版权所有 京ICP备080100-44备0000111000号<br />
			违法和不良信息举报电话：188-0130-1238，本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</p>
		</div>
		<script src="../../js/jquery-3.5.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/public.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/nav.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/pro.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/cart.js" type="text/javascript" charset="utf-8"></script>
	</body>
<script type="text/javascript">
	$(document).ready(function () {
		$.ajax({
			url: "/getUserInfo",
			type: "GET",
			dataType: "json",
			success: function(json) {
				if (json.state == 200) {
					console.log("username=" + json.data.username);
					console.log("email=" + json.data.email);
					$("#username").val(json.data.username);
					$("#email").val(json.data.email);
					$("#username").text('欢迎您！'+json.data.username)

				} else {
					alert("获取用户信息失败！" + json.message);
				}
			}
		});
	});
</script>
</html>
